<template>
  <el-dialog title="就诊记录" v-model="visible"
             :close-on-click-modal="false" draggable width="60%">


    <el-row class="ml10">
      <el-form :inline="true" :model="state.queryForm" ref="queryRef">
        <el-form-item label="就诊医生" prop="type">
          <el-radio-group v-model="state.queryForm.type">
            <el-radio-button value="0" label="0">家庭医生</el-radio-button>
            <el-radio-button value="1" label="1">其他</el-radio-button>
          </el-radio-group>
        </el-form-item>

        <!--        <el-form-item>-->
        <!--          <el-button @click="getDataList" formDialogRef icon="search" type="primary">-->
        <!--            {{ $t('common.queryBtn') }}-->
        <!--          </el-button>-->
        <!--          <el-button @click="resetQuery" formDialogRef icon="Refresh">{{-->
        <!--              $t('common.resetBtn')-->
        <!--            }}-->
        <!--          </el-button>-->
        <!--        </el-form-item>-->

      </el-form>
    </el-row>


    <el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
              :header-cell-style="tableStyle.headerCellStyle" highlight-current-row
              @sort-change="sortChangeHandle">
      <el-table-column type="index" label="#" width="45"/>
      <el-table-column prop="name" label="姓名" show-overflow-tooltip/>
      <el-table-column prop="doctorName" label="家庭医生" show-overflow-tooltip/>
      <el-table-column prop="villageName" label="村" show-overflow-tooltip/>
      <el-table-column prop="roomDoctor" label="就诊医生" show-overflow-tooltip/>
      <el-table-column prop="dept" label="就诊科室" show-overflow-tooltip/>
      <el-table-column prop="number" label="就诊次数" show-overflow-tooltip/>
      <el-table-column prop="time" label="就诊时间" show-overflow-tooltip width="180"/>
    </el-table>
    <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
                v-bind="state.pagination"/>
  </el-dialog>

</template>
<script setup lang="ts" name="bloodTicket">
import {BasicTableProps, useTable} from "/@/hooks/table";
const queryRef = ref();
const visible = ref(false)
const state: BasicTableProps = reactive<BasicTableProps>({
  queryForm: {},
  // pageList: fetchList,
  createdIsNeed: false,
  dataList: [{
    name: '张三',
    doctorName: '李四',
    villageName: '白鹤村',
    roomDoctor: '王五',
    dept: '内科',
    time: '2024-08-01 08:00:00',
    number: 1
  }, {
    name: '张三',
    doctorName: '李四',
    villageName: '白鹤村',
    roomDoctor: '王五',
    dept: '内科',
    time: '2024-08-01 08:00:00',
    number: 1
  }, {
    name: '张三',
    doctorName: '李四',
    villageName: '白鹤村',
    roomDoctor: '王五',
    dept: '内科',
    time: '2024-08-01 08:00:00',
    number: 1
  }, {
    name: '张三',
    doctorName: '李四',
    villageName: '白鹤村',
    roomDoctor: '王五',
    dept: '内科',
    time: '2024-08-01 08:00:00',
    number: 1
  }],
})

const {
  getDataList,
  currentChangeHandle,
  sizeChangeHandle,
  sortChangeHandle,
  tableStyle
} = useTable(state);

const openDialog = (row: any) => {
  visible.value = true
  state.queryForm = {customerId: row.id, type: '0'}
  getDataList()
};


// 清空搜索条件
// const resetQuery = () => {
//   // 清空搜索条件
//   queryRef.value?.resetFields();
//   // 清空多选
//   selectObjs.value = [];
//   getDataList();
// };

// 暴露变量
defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">

</style>
